<%@page import="com.hamizhong.iflowers.web.vo.VarietyVO"%>
<%@page import="com.hamizhong.iflowers.web.vo.ColorVO"%>
<%@page import="com.hamizhong.iflowers.web.vo.ProductVO"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="../../common/common_admin.jsp" %>
<title>产品管理</title>
</head>
<script type="text/javascript">
	//初始化方法
	$(function() {
		initItemList(1);
	});
	//初始化数据列表
	function initItemList(pageNum) {
		$.ajax({
			url: '<%=request.getContextPath() %>/admin/ajaxQueryProduct.action',
			data: {'pageNum': pageNum},
			type: 'post',
			dataType: 'json',
			async: false,
			success: ajaxQueryProduct_Callback
		});
	}
	function ajaxQueryProduct_Callback(res) {
		var rs = res.result;
		if(rs == 0) {
			var data = res.data;
			var totalCnt = res.totalCnt;
			var totalPageCnt = res.totalPageCnt;
			var pageNum = res.pageNum;
			var itemListHtmlStr = '';
			if(data.length > 0) {
				/*列表*/
				itemListHtmlStr += '<thead>'+
								'<tr>'+
									'<th width="100">产品ID</th>'+
									'<th width="200">产品名称</th>'+
									'<th width="100">花材</th>'+
									'<th width="100">颜色</th>'+
									'<th width="100">排序号</th>'+
									'<th width="200">备注</th>'+
									'<th width="100">操作</th>';
								'</tr>'+
							'</thead>';
				for(var i=0;i<data.length;i++) {
					itemListHtmlStr += '<tr>'+
									'<td>'+
										data[i].productId+
									'</td>'+
									'<td>'+
										data[i].productName+
									'</td>'+
									'<td>'+
										data[i].varietyName+
									'</td>'+
									'<td>'+
										data[i].colorName+
									'</td>'+
									'<td>'+
										data[i].sortId+
									'</td>'+
									'<td>'+
										data[i].remarks+
									'</td>'+
									'<td>'+
										'<a href="javascript: void(0)" onclick="updateItem(\''+data[i].productId+'\',\''+data[i].productName+'\',\''+data[i].sortId+'\',\''+data[i].remarks+'\',\''+data[i].varietyId+'\',\''+data[i].colorId+'\')">修改</a>&nbsp;&nbsp;'+
										'<a href="javascript: void(0)" onclick="deleteItem(\''+data[i].productId+'\',\''+data[i].productName+'\')">删除</a>&nbsp;&nbsp;'+
									'</td>'+
								'</tr>';
				}
			}else {
				itemListHtmlStr += '<font color="red">当前类别暂无数据项，请添加！</font>';
			}
			$('#itemListTable').html(itemListHtmlStr);
			
			/*分页*/
			var pagingHtmlStr = queryPagingModule(pageNum,totalPageCnt,totalCnt);
			$('#pagingDiv').html(pagingHtmlStr);
		}else {
			alert("初始化数据失败！");
		}
	}
	
	//跳转到指定页码
	function goTargetPageNum(targetPageNum) {
		initItemList(targetPageNum);
	}
	function checkToTargetPage(totalPageNum) {
		var inputPageNum = $('#targetPageInput').val();
		//判断是否为空--是否为整数--是否为正数--是否为有效页数内的正整数
		if( isNaN(inputPageNum) || (parseInt(inputPageNum) != inputPageNum) || 
				(Math.abs(parseInt(inputPageNum)) != parseInt(inputPageNum)) ||  (inputPageNum > totalPageNum) || (inputPageNum < 1 )) {
			alert("请输入查询范围内的正整数页码！");
			return;
		}else {
			goTargetPageNum(inputPageNum);
		}
	}
	
	//ajax添加数据
	function ajaxAddItem() {
		var str = '<%=request.getContextPath() %>/admin/ajaxAddProduct.action';
		var productName = $('#productName').val();
		//var productId = $('#productId').val();
		var varietyId = $('#varietyId').val();
		var colorId = $('#colorId').val();
		var sortId = $('#sortId').val();
		var remarks = $('#remarks').val();
		$.ajax({
			url: str,
			data: {
				"productName": productName,
				"varietyId": varietyId,
				"colorId": colorId,
				"sortId": sortId,
				"remarks": remarks
			},
			type: 'post',
			dataType: 'json',
			async: true,
			success: ajaxAddProduct_Callback
		});
	}
	function ajaxAddProduct_Callback(res) {
		var result = res.result;
		if(result == 0) {
			alert("添加成功！");
			$('#itemForm')[0].reset();
			initItemList(1);
		} else if(result == 1) {
			alert(res.msg);
			$('#itemForm')[0].reset();
			return;
		}
	}

	//更新数据操作
	function updateItem(productId,productName,sortId,remarks,varietyId,colorId) {
		$('#productId').val(productId);
		$('#varietyId').val(varietyId);
		$('#colorId').val(colorId);
		$('#varietyId').attr("disabled", true);
		$('#colorId').attr("disabled", true);
		$('#productName').val(productName);
		$('#sortId').val(sortId);
		$('#remarks').val(remarks);
		showUpdateFormBtns();
	}
	//取消更新数据操作
	function cancelUpdateItem() {
		$('#itemForm')[0].reset();
		showAddFormBtns();
		$('#varietyId').attr("disabled", false);
		$('#colorId').attr("disabled", false);
	}
	//ajax更新数据
	function ajaxUpdateItem() {
		var str = '<%=request.getContextPath() %>/admin/ajaxUpdateProduct.action';
		var productName = $('#productName').val();
		var productId = $('#productId').val();
		var sortId = $('#sortId').val();
		var remarks = $('#remarks').val();
		$.ajax({
			url: str,
			data: {
				"productName": productName,
				"productId": productId,
				"sortId": sortId,
				"remarks": remarks
			},
			type: 'post',
			dataType: 'json',
			async: true,
			success: ajaxUpdateProduct_Callback
		});
	}
	function ajaxUpdateProduct_Callback(res) {
		var result = res.result;
		if(result == 0) {
			alert("修改成功！");
			$('#itemForm')[0].reset();
			showAddFormBtns();
			$('#varietyId').attr("disabled", false);
			$('#colorId').attr("disabled", false);
			initItemList(1);
		}else {
			alert(res.msg);
		}
	}
	
	//删除数据操作
	function deleteItem(itemId, itemName) {
		if($('#updateBtn').css('display') != 'none') {
			alert('当前存在正在编辑的条目，请先取消编辑再操作');
			return false;
		}
		if(confirm("是否要删除 [ "+itemName+" ] 吗？")) {
			ajaxDeleteItem(itemId);
		}else {
		}
	}
	//ajax删除数据
	function ajaxDeleteItem(itemId) {
		var str = '<%=request.getContextPath() %>/admin/ajaxDeleteProduct.action';
		$.ajax({
			url: str,
			data: {
				"productId": itemId
			},
			type: 'post',
			dataType: 'json',
			async: true,
			success: ajaxDeleteProduct_Callback
		});
	}
	function ajaxDeleteProduct_Callback(res) {
		var result = res.result;
		if(result == 0) {
			alert("删除成功！");
			initItemList(1);
		}else {
			alert(res.msg);
		}	
	}
	
	//添加-更新按钮组切换
	function showAddFormBtns() {
		$('#addBtn').show();
		$('#updateBtn').hide();
		$('#updateCancelBtn').hide();
	}
	function showUpdateFormBtns() {
		$('#addBtn').hide();
		$('#updateBtn').show();
		$('#updateCancelBtn').show();
	}
</script>

<%
	List<VarietyVO> varietyVOList = (List<VarietyVO>)request.getAttribute("varietyVOList");
	List<ColorVO> colorVOList = (List<ColorVO>)request.getAttribute("colorVOList");
%>

<body>
	<div class="displayPageHeader">当前位置：产商管理 >> 产品管理</div>
	<div class="pageDiv">
		<div class="pageHeadDiv">新增产品</font></div>
		<div class="infoDiv">
			<form id="itemForm" action="#none" method="post">
				<table>
					<tr>
						<td>&nbsp;&nbsp;花&nbsp;&nbsp;材&nbsp;&nbsp;</td>
						<td>
							<select id="varietyId" name="varietyId" style="width: 150px;">
								<%
									for(VarietyVO varietyVO : varietyVOList) {
								%>
									<option value="<%=varietyVO.getVarietyId()%>"><%=varietyVO.getVarietyName() %></option>
								<%
									}
								%>
							</select>
						</td>
					</tr>
					<tr>
						<td>&nbsp;&nbsp;颜&nbsp;&nbsp;色&nbsp;&nbsp;</td>
						<td>
							<select id="colorId" name="colorId" style="width: 150px;">
								<%
									for(ColorVO colorVO : colorVOList) {
								%>
									<option value="<%=colorVO.getColorId()%>"><%=colorVO.getColorName() %></option>
								<%
									}
								%>
							</select>
						</td>
					</tr>
					<tr>
						<td>&nbsp;&nbsp;产品名称&nbsp;&nbsp;</td>
						<td><input type="text" name="productName" id="productName" style="width: 150px;"></td>
					</tr>
					<tr>
						<td>&nbsp;&nbsp;排序号&nbsp;&nbsp;</td>
						<td><input type="text" name="sortId" id="sortId" style="width: 150px;"></td>
					</tr>
					<tr>
						<td>&nbsp;&nbsp;备&nbsp;&nbsp;注&nbsp;&nbsp;</td>
						<td><input type="text" name="remarks" id="remarks" style="width: 150px;"></td>
					</tr>
					<tr style="display: none;">
						<td>产品ID(更新时使用)</td>
						<td><input type="text" name="productId" id="productId" style="width: 150px;"></td>
					</tr>
					<tr>
						<td></td>
						<td>
							<input type="button" id="addBtn" onclick="ajaxAddItem()" value="确定添加" style="display: block">
							<input type="button" id="updateBtn" onclick="ajaxUpdateItem()" value="确定修改" style="display: none">
							<input type="button" id="updateCancelBtn" onclick="cancelUpdateItem()" value="取消修改" style="display: none">
						</td>
					</tr>
				</table>
			</form>
		</div>
	</div>
	<div class="pageDiv">
		<div class="pageHeadDiv">管理产品</div>
		<div class="infoDiv">
			<div class="itemListDiv">
				<table border="1px" id="itemListTable">
					
				</table>
			</div>
			<div class="margin_5"></div>
			<div id="pagingDiv" style="border: 1px solid #CCC;width: 100%;height: 25px;line-height: 25px;text-align: left;">
				
			</div>
		</div>
	</div>
</body>
</html>